import vueRouter from 'vue-router'
import Vue from "vue";
import Home from '@/pages/Home'
import About from "@/pages/About";
import News from "@/pages/News";
import Message from "@/pages/Message";
import ButtonRouter from "@/pages/ButtonRouter";

Vue.use(vueRouter)

const route = new vueRouter({
    mode:'history',
    routes:[
        {
            path:'/home',
            component:Home,
            // beforeEnter:(to, from, next)=>{
            //     console.log(to,from,next)
            //     next()
            // }
        },
        {
            path:'/about',
            component:About,
            children:[
                {
                    name:'news',
                    path:'news/:id/:name',
                    component:News
                },
                {
                    name:'message',
                    path:'message',
                    component:Message,
/*                    props:{
                        id:'111',
                        title:"今日新闻"
                    }*/
/*                    props:true*/
                    props:({query:{id,title}})=>{
                        return {id:id,title:title}
                    }
                },
                {
                    name:'buttonRouter',
                    path:'buttonRouter',
                    component:ButtonRouter
                }
            ]
        }
    ]
})
//全局前置路由
// route.beforeEach((to, from, next)=>{
//     console.log(to,from,next)
//     next();
// })
// //全局后置
// route.afterEach((to,from)=>{
//     console.log(to,from)
// })
//解决router3下编程式路由导航多次点击报错
const originalPush = vueRouter.prototype.push
vueRouter.prototype.push = function(location){
    console.log(this)
    return originalPush.call(this,location).catch(err => err);
}
export default route